图片上传使用的是Easyui+MVC,用from表单进行提交,并将图片名称和后缀提交到数据库。有一些功能可能不够完善，欢迎进行补充。

先上效果图

下边直接上代码：

（1）先在要提交的表单中添加上传框，再加一个图片显示，可以让他在添加的时候进预览。

（2）在后台添加文件传输到服务器的代码

单张图片上传HttpFileCollectionBase files = Request.Files;HttpPostedFileBase file = files["img"];//获取文件后缀名string extName = Path.GetExtension(file.FileName).ToLower();if(extName!=".jpg"||extName!=".gif"||extName!=".bmp"||extName!=".png"){       string ls = "上传了不被识别的格式，请重新上传";       return null;}       //获取保存目录的物理路径       string path = Server.MapPath("~/Img/");       //生成新文件的名称，guid保证某一时刻内唯一的（保证了文件不会被覆盖）       string fileNewName = System.Guid.NewGuid().ToString();       file.SaveAs(path + fileNewName + extName);

这是单张图片进行上传，里边我都加了注释说明。

下边上多张图片的代码

//多张图片上传          HttpFileCollectionBase files = Request.Files;           foreach (var item in files.AllKeys)           {            HttpPostedFileBase file = files[item];          //获取文件后缀名         string extName = Path.GetExtension(file.FileName).ToLower();       //获取保存目录的物理路径      string path = Server.MapPath("~/Img/");      //生成新文件的名称，guid保证某一时刻内唯一的（保证了文件不会被覆盖）      string fileNewName =System.Guid.NewGuid().ToString();      file.SaveAs(path + fileNewName + extName);    }

然后是异步上传

HttpFileCollectionBase files = Request.Files;            HttpPostedFileBase file = Request.Files["imgs"];            string extName = Path.GetExtension(file.FileName).ToLower();            string path = Server.MapPath("~/Img/");            //生成新文件的名称，guid保证某一时刻内唯一的（保证了文件不会被覆盖）            string fileNewName = System.Guid.NewGuid().ToString();            file.SaveAs(path + fileNewName + extName);            model.img = fileNewName+extName;

我传输的都是文件名加后缀，并且都是在添加和修改方法中写的，如果有个人其他需求，可以在另外写到不同的地方。

（3）然后就是前台显示了

{ title: '营业执照', field: 'img', halign: 'center', align: 'center', sortable: true, formatter: function (value, row) {
                             if (typeof (row.img) != "undefined") {                            row.img = "";                        }                        return row.img;                    }                },

在这之后你弹出表单抓取数据时，需要加上

$("#tt").attr("src", "../Images/" + data.img);

来获取现在图片显示的功能。

（4）对，还有表单提交的内容，这样彩后详细

$("#fm").form("submit", {                        url: url,                        success: function (data) {
                                 var data = eval('(' + data + ')');                            $("#storelist").datagrid("load", {});                            $.messager.alert("提示", data.msg, "info");                            $("#dptdialog").dialog("close");                            $("#fm").form("reset");                        },                        error: function () {
                                 $.messager.alert("警告", "对不起，系统出现故障，请联系管理员！", "error");                            $("#dptdialog").dialog("close");                            $("#fm").form("reset");                        },                    });

fm是我form表单的ID，url调的是他上边修改的url。

在form表单上需要加上enctype="multipart/form-data" method="post"

否则后台file 会一直报空。

重点还得说的是， form提交不能直接解析Json，需要用var data = eval('(' + data + ')');来先进行Json解析。

在执行完上边以后你的照片应该可以正常上传了，但是你会发现照片没有办法实时预览。这个时候，你对表单的图片在首次加载上进行异步提交

$("#tj").change(function () {
                 $("#fm").form("submit", {                url: "/Store/UpLoad",                success: function (data) {
                         $("#tt").attr("src", "/Images/" + data);                }            });        });

下边是他的后台代码

public ActionResult UpLoad()        {         HttpFileCollectionBase files = Request.Files;            HttpPostedFileBase file = Request.Files["imgs"];            string extName = Path.GetExtension(file.FileName).ToLower();            string path = Server.MapPath("~/Images/");            //生成新文件的名称，guid保证某一时刻内唯一的（保证了文件不会被覆盖）            string fileNewName = System.Guid.NewGuid().ToString();            file.SaveAs(path + fileNewName + extName);            return Content(fileNewName + extName);        }

这样他就可以在添加修改时实现实时预览了。

---

---

---

如果有补充，或者什么问题欢迎留言，一起讨论。后期如果有什么修改，我会及时进行标注。